305. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2021-05-13 09:09:06 +0000. See www.araxis.com for information about Merge. This report uses XHTML and CSS2, and is best viewed with a modern standards-compliant browser. For optimum results when printing this report, use landscape orientation and enable printing of background images and colours in your browser.

305.1 Files compared

#LocationFileLast Modified
1/Applications/Ampps/www/Porto 3.2.2/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto/Smartwave_Porto/web/css/source_module.less2016-06-18 15:04:26 +0000
2/Applications/Ampps/www/Porto v4.0.0/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto/Smartwave_Porto/web/css/source_module.less2021-04-17 02:10:32 +0000

305.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged77680
Changed49935
Inserted15430
Removed1349

305.3 Comparison options

WhitespaceConsecutive whitespace is treated as a single space
Character caseDifferences in character case are significant
Line endingsDifferences in line endings (CR and LF characters) are ignored
CR/LF charactersNot shown in the comparison detail
Active line-pairing rules

305.4 Active regular expressions

No regular expressions were active.

305.5 Comparison detail

1 // /** 1 // /**
2 //  * Copyright © 2015 Magento. All rights reserved. 2 //  * Copyright © 2015 Magento. All rights reserved.
3 //  * See COPYING.txt for license details. 3 //  * See COPYING.txt for license details.
4 //  */ 4 //  */
5 & when (@media-common = true) { 5 & when (@media-common = true) {
6     .theme-color { 6     .theme-color {
7         color: @theme-color !important; 7         color: @theme-color !important;
8     } 8     }
9     .block { 9     .block {
10         .block-title { 10         .block-title {
11             margin: 5px 0 10px; 11             margin: 5px 0 10px;
12             line-height: 1.2; 12             line-height: 1.2;
13             font-size: 16px; 13             font-size: 16px;
14         } 14         }
15     } 15     }
16     // 16     .porto-separator {
17     //  Footer 17       margin: 0 0 22px;
18     //  --------------------------------------------- 18       &.short {
19     .footer { 19           margin: -11px 0 11px;
20         ul { 20       }
21             list-style: none; 21       &.tall {
    22           margin: 22px 0 44px;
    23       }
    24       &.taller {
    25         margin: 44px 0 66px;
    26       }
    27       .separator-line {
    28         margin: 0 auto;
    29         &.align_left {
    30             margin: 0 auto 0 0;
    31         }
    32         &.align_center {
    33             margin: 0 auto;
    34         }
    35         &.align_right {
    36             margin: 0 0 0 auto;
    37         }
    38       }
    39     }
    40     .porto-ibanner {
    41         z-index: 1;
    42         overflow: hidden;
    43         margin: 0 0 35px;
    44         text-align: center;
    45         &,>img {
    46             display: block;
    47             position: relative;
    48         }
    49         >img {
    50             width: 100%;
    51             transition: opacity 0.35s;
    52             border: none;
    53             padding: 0;
22             margin: 0; 54             margin: 0;
    55             min-height: inherit;
    56             object-fit: cover;
    57             transition: transform 0.5s,opacity 0.5s;
    58             -webkit-backface-visibility: hidden;
    59             &.porto-lazyload:not(.lazy-load-loaded) {
    60                 visibility: hidden;
    61             }
    62         }
    63         &-layer {
    64             text-align: left;
    65             font-size: 1rem;
    66         }
    67         .porto-ibanner-desc {
    68             padding: 15px;
    69             color: #fff;
    70             font-size: 1em;
    71             -webkit-backface-visibility: hidden;
    72             backface-visibility: hidden;
    73             transition: opacity 0.3s;
    74             &.no-padding {
23             padding: 0; 75                 padding: 0;
24         } 76             }
25         li { 77             .porto-ibanner-container {
    78                 position: relative;
    79                 height: 100%;
    80             }
    81             &:before,&:after {
    82                 pointer-events: none;
    83             }
    84         }
    85         .porto-ibanner-desc,.porto-ibanner-link {
    86             position: absolute;
    87             top: 0;
    88             left: 0;
    89             width: 100%;
    90             height: 100%
    91         }
    92         .porto-ibanner-content {
    93             font-size: .8125em;
    94             line-height: 1.6;
    95         }
    96         .porto-ibanner-title,p {
    97             letter-spacing: normal;
    98             padding: 0;
26             margin: 0; 99             margin: 0;
    100             font-size: inherit;
    101             line-height: inherit;
    102             font-weight: inherit;
    103             text-decoration: inherit;
    104             font-style: inherit;
    105             color: inherit;
27         } 106         }
    107         a.porto-ibanner-link {
    108             display: block;
    109             z-index: 7;
    110             opacity: 0;
    111             background: 0 0;
28     } 112         }
29     .footer-top {    
30             
31     } 113     }
32     .footer-middle { 114     ul.products {
33         background-color: @footer-middle_background-color; 115       .product-col {
34         color: @footer-middle_font-color; 116         padding-left10px
;
35         padding
40px 0;
 117         padding-right: 10px;
36             
37         > .container {    
38             position: relative;    
39         } 118       }
40          119       li.product-category {
41         [class^="porto-icon-"], [class*=" porto-icon-"] { 120           text-align: center;
42             color: @footer-middle-icon_font-color; 121           a {
    122               text-decoration: none;
43         } 123           }
44         .block { 124           .thumb-info {
    125               min-height: 90px;
    126               margin-bottom: 0;
45             text-align: left; 127               text-align: left;
46             line-height: 1.5; 128               h3 {
    129                   font-weight: 700;
    130                   margin: 0 0 10px;
    131                   color: inherit;
    132                   letter-spacing: -.005em;
    133               }
    134           }
    135           .thumb-info-title {
    136               background: none;
    137               max-width: none;
    138               width: 100%;
    139               bottom: 0;
    140               padding: 1.2em 1.5em;
47             margin: 0; 141               margin: 0;
48             width: auto; 142           }
49             
 143           .thumb-info-type {
50             .block-title { 144               display: block;
51                 margin-bottom: 20px; 145               margin: -10px 0 0;
52                  146               padding: 0;
53                 strong {    
54                     font-weight: 400; 147               font-weight: 400;
    148               background: none;
    149               float: none;
    150               opacity: .7;
    151               line-height: 1.8;
    152           }
    153 
    154           mark {
55                     padding: 0; 155               padding: 0;
56                     font-size: 16px; 156               background: none;
57                     color: @footer-middle-block-title_font-color; 157               color: inherit;
58                     text-transform: none;    
59                 } 158           }
    159           .thumb-info-wrapper:after {
    160               background: rgba(27, 27, 23, .15);
    161               z-index: 1;
    162               opacity: 1;
60             } 163           }
61              164           &:hover .thumb-info-wrapper:after {
62             &.newsletter { 165               background: rgba(27, 27, 23, .3);
63                 width: auto;    
64                     
65                 .form.subscribe {    
66                     max-width: 300px;    
67                 } 166           }
68                 label { 167       }
69                     margin-top50px; 168       li.cat-has-icon {
    169           .thumb-info {
    170               padding: 40px 0 25px;
    171               transition: box-shadow .2s;
    172               text-align: center;
    173               > i {
    174                   font-size: 3em;
    175                   display: inline-block;
    176                   margin-bottom15px;
    177               }
    178           }
    179           .thumb-info-wrap {
70                     display: block; 180               display: block;
71                     text-alignleft; 181           }
72                     font-size: 13px; 182           .thumb-info-title {
    183               display: block;
    184               position: static;
    185               padding: 0 0 10px;
    186           }
    187       }
    188       &.category-pos-middle li.product-category .thumb-info-title {
    189           position: absolute;
    190           bottom: auto;
    191           top: 50%;
    192           transform: translateY(-50%);
    193       }
    194       &.category-pos-outside li.product-category .thumb-info-title {
    195           position: static;
    196           transform: none;
    197           display: block;
    198           padding-left: 0;
    199           padding-right: 0;
    200       }
    201       &.category-text-center .thumb-info-title {
    202           text-align: center;
    203       }
    204       &.category-text-right .thumb-info-title {
    205             text-alignright;
    206         }
    207     }
    208     li.product-category {
    209       .thumb-info-title a {
    210         color: inherit
    211       }
    212       .thumb-info-title a:hover {
    213         color: inherit;
    214         text-decoration: underline;
    215       }
    216       .sub-categories {
    217         font-size: .875rem;
73                     font-weight: 400; 218         font-weight: 400;
74                     padding: 0; 219         opacity: .7
75                     margin-bottom: 15px;    
76                     line-height: 1.5;    
77                 } 220       }
78                 .field .control:before { 221     }
    222     ul.category-color-dark li.product-category .thumb-info-title {
    223       color: #1d2127;
    224     }
    225     .grid-creative {
    226         &.category-pos-outside {
    227             li.product-category .thumb-info {
    228                 height: calc(~"100% - (60px)");;
    229             }
    230         }
    231     }
    232     .porto-products.show-count-on-hover li.product-category .thumb-info-type {
    233         max-height: 10px;
    234         transition: .5s;
    235         transform: translateY(20%);
    236         opacity: 0;
    237     }
    238     .porto-products.show-count-on-hover li.product-category:hover .thumb-info-type {
    239         max-height: 30px;
    240         transform: translateY(0);
    241         opacity: .7;
    242     }
    243     .porto-products.hide-count {
    244         li.product-category {
    245             .thumb-info-type {
79                     display: none; 246                 display: none;
80                 } 247             }
    248             .thumb-info h3 {
    249                 margin-bottom: 0;
    250             }
    251         }
    252     }
    253     .thumb-info {
    254       display: block;
    255       position: relative;
    256       text-decoration: none;
    257       max-width: 100%;
    258       -webkit-backface-visibility: hidden;
    259       backface-visibility: hidden;
    260       -webkit-transform: translate3d(0,0,0);
    261       transform: translate3d(0,0,0);
    262       .thumb-info-wrapper {
    263         -webkit-backface-visibility: hidden;
    264         backface-visibility: hidden;
    265         -webkit-transform: translate3d(0,0,0);
    266         transform: translate3d(0,0,0);
    267         margin: 0;
    268         overflow: hidden;
    269         display: block;
    270         position: relative;
    271         &:after {
    272           content: "";
    273           transition: all 0.3s;
    274           bottom: 0;
    275           color: #FFF;
    276           left: 0;
    277           position: absolute;
    278           right: 0;
    279           top: 0;
    280           display: block;
    281           opacity: 0;
    282           z-index: 1
    283         }
    284       }
    285       .thumb-info-title {
    286         transition: all 0.3s;
    287         background: rgba(33,37,41,.8);
    288         bottom: 13%;
    289         color: #fff;
    290         font-size: 17px;
    291         font-weight: 600;
    292         left: 0;
    293         letter-spacing: -.05em;
    294         padding: 13px 21px 2px;
    295         position: absolute;
    296         z-index: 2;
    297         max-width: 90%;
    298       }
    299       .thumb-info-inner {
    300         transition: all 0.3s;
    301         display: block;
    302         font: inherit;
    303         color: inherit;
    304         margin-bottom: 0;
    305       }
    306       .thumb-info-type {
    307         display: inline-block;
    308         float: left;
    309         font-size: .6em;
    310         font-weight: 600;
    311         letter-spacing: 0;
    312         margin: 8px -2px -15px 0;
    313         padding: 2px 12px;
    314         text-transform: uppercase;
    315         z-index: 2;
    316         line-height: 2.3;
    317       }
    318       img {
    319         transition: all 0.3s ease;
    320         position: relative;
    321         width: 100%;
    322       }
    323     }
    324     .single-subscribe {
    325       .newsletter {
    326         .control {
    327           display: flex;
    328           align-items: center;
    329         }
    330         .input-text {display: block;flex:1;}
81                 input { 331         input {
82                     padding
0 10px;
 332           height: 3rem;
83                     background-color: @footer-middle-newsletter-input_background-color; 333           padding-left20px;
84                     border-radius: 5px 0 0 5px; 334           padding-right: 25px;
85                     height: 30px; 335           border-radius: 30px 0 0 30px;
86                     border: 0; 336           font-size: .75rem;
    337           color: #777;
    338           border: none;
    339           margin: 0;
    340           width: 100%;
    341           display: block;
87                 } 342         }
88                 .action.subscribe { 343         .action
 {
89                     border-radius: 0 5px 5px 0; 344           height: 3rem;
90                     height: 30px; 345           padding-left: 20px;
91                     font-size: 14px; 346           padding-right: 20px;
92                     line-height: 30px; 347           text-transform: uppercase;
93                     padding: 0 13px; 348           font-weight: 700;
94                     font-weight: 400; 349           border-radius: 0 30px 30px 0;
95                 } 350         }
96             } 351       }
97         } 352     }
98         ul { 353     .porto-links-block {
99             &.links
 {
 354       border: 1px solid;
100                 
margin-top-5px;
 355       
.links-title {
101                 
 356         border-bottom: 1px solid;font-size: 1em;font-weight: 700;line-height: 14px;padding: 15px 20px;margin: 0;text-transform: uppercase;position: relative;letter-spacing: .12px;transition: 0.25s;
    357         i {margin-right
5px;}
    358       }
    359       .links-content ul {list-style: none;padding: 5px 0;margin: 0;}
    360       li.porto-links-item {
    361         display: block;margin: 0;
    362         &:first-child>a,&:first-child>span {border-top-width: 0;}
    363         a,span {display: block;font-size: 1em;line-height: 20px;color: #465157;letter-spacing: .1px;padding: 11px 6px 10px;margin: 0 10px -1px;text-decoration: none;border-top: 1px solid #ddd;}
    364         a:hover {text-decoration: underline;}
    365         i {margin-right: 12px;font-size: 20px;float: left;}
    366         i.icon-image {display: inline-block;vertical-align: middle;float: none;max-width: 20px;}
    367       }
    368     }
    369     .divider {
    370       height: 1px;
    371       &.divider-small {
    372         margin: 22px auto;background: transparent;
    373         &.divider-small-center {
    374           text-align: center;
    375           hr {margin-left: auto;margin-right: auto;}
    376         }
    377         hr {width: 50px;height: 1px;}
    378       }
    379     }
    380     .category-sidebar{
    381       padding: .7143em 0;
    382       list-style:none;
    383       margin:0;
    384       font-size: .9286em;
102                 li { 385       li {
103                     position: relative; 386         position:
relative;
104                     padding: 10px 0; 387         margin:0;
105                     line-height: 1; 388         color: #777;
    389         > a:not(.expand-icon){
106                     display: block; 390           display: block;
    391           font-size: .875rem;
    392           font-weight: 600;
    393           padding-top: .625rem;
    394           padding-bottom: .625rem;
    395           border-bottom: 1px solid #e7e7e7;
    396           color: inherit;
    397         }
    398         >.expand-icon{
    399           position: absolute;
    400           right: -6px;
    401           top: 9px;
    402           font-size: 18px;
    403           line-height: 24px;
    404           color: inherit;
    405           width: 24px;
    406           height: 24px;
    407           em.porto-icon-plus-squared::before {content:"\f807";}
    408           em.porto-icon-minus-squared::before {content:"\f804";}
    409         }
    410       }
    411       > li {
    412         &:last-child {
    413           > a:not(.expand-icon){
    414             border-bottom: 0;
    415           }
    416         }
    417       }
    418       ul{display:none;list-style:none;padding-left: 1.0714em;margin:0}
    419     }
    420     .onepage-category{
    421       >.category-list{
    422         position:fixed;
    423         left:0;
    424         top:0;
    425         bottom: 0;
    426         min-height:100%;
    427         width:80px;
    428         text-align:left;
    429         background:#222529;
    430         padding:32px 0 0;
    431         z-index:20;
    432         >ul{
    433           position:relative;
    434           z-index:2;
    435           list-style:none;
    436           padding:0;
    437           transition:all .3s;
    438           padding-top:0;
    439           margin-bottom:0;
    440           >li{
107                     margin: 0; 441             margin: 0;
108                      442             margin-bottom: 1rem;
109                     [class^="porto-icon-"], [class*=" porto-icon-"] { 443             >a{
110                         margin-left: -5px; 444               color:#fff;
    445               width:auto;
    446               line-height:79px;
    447               display:inline-block;
    448               white-space:nowrap;
    449               position:relative;
    450               transition:all .3s;
    451               >em{
    452                 font-size:1.6875rem;
    453                 width:80px;
    454                 display:inline-block;
    455                 text-align:center;
    456                 vertical-align:middle;
    457                 >img{
    458                   vertical-align:middle;
111                     } 459                 }
112                 } 460               }
    461               >span{
    462                 display:inline-block;
    463                 vertical-align:middle;
    464                 opacity:0;
    465                 visibility:hidden;
    466                 width:0;
    467                 transition:all .3s;
    468                 font-size:16px;
    469                 font-weight:600;
    470                 position:relative;
    471                 overflow:hidden;
113             } 472               }
114             &.contact-info { 473               &:after{
115                 li { 474                 content:"";
116                     padding: 5px 0; 475                 width:16px;
117                      476                 height:16px;
118                     &:first-child { 477                 position:absolute;
119                         padding-top: 0; 478                 display:block;
    479                 right:-15px;
    480                 top:50%;
    481                 margin-top:-8px;
    482                 border:8px solid transparent;
    483                 transition:all .3s;
120                     } 484               }
    485               &.active,&:hover{
    486                 background-color:#00d59d;
    487                 &:after{
    488                   border-left-color:#00d59d;
121                 } 489                 }
122                 [class^="porto-icon-"], [class*=" porto-icon-"] { 490               }
    491               &:hover {
    492                 >span{
    493                   opacity:1;
    494                   visibility:visible;
    495                   width:auto;
    496                   padding-right:50px;
    497                 }
    498               }
    499             }
    500             &:last-child{margin-bottom:0;}
    501           }
    502         }
    503       }
    504       >.category-details{
    505         position:relative;
    506         float:right;
    507         width:100%;
    508         min-height:80vh;
    509       }
    510       .category-details{
    511         padding: 70px 0;
    512         .title-menu{
    513           position:relative;
    514           margin-bottom: 25px;
    515           >a{
    516             font-family: 'Poppins';
    517             color: #222529;
123                     display: inline-block; 518             display: inline-block;
124                     vertical-align: top; 519             margin-top: 0;
125                     font-size: 14px; 520             font-size: 1.375rem;
126                     line-height: 18px; 521             font-weight: 600;
127                     margin-left: -5px; 522             letter-spacing: .025em;
128                     margin-right: 3px; 523             line-height: 46px;
    524             text-transform: uppercase;
    525             >span{
    526               display:inline-block;
    527               vertical-align:middle;
129                 } 528             }
130                 p { 529             &.parent{
    530               &:after{
    531                 display:inline-block;
    532                 content:"\f813";
    533                 font-family:porto-icons;
    534                 margin-left:18px;
    535                 font-size:18px;
    536                 vertical-align:middle;
    537                 line-height:36px;
    538               }
    539               &.opened:after{content:"\f810";}
    540             }
    541           }
    542           >.menu-popup{
    543             position:absolute;
    544             left: 0;
    545             top:100%;
    546             display:none;
    547             width:100%;
    548             z-index:3;
    549             background-color:#fff;
    550             border:1px solid #bebebe;
    551             border-radius:5px;
    552             padding:50px 0;
    553             &:before{
    554               content:"";
    555               border:8px solid transparent;
    556               width:16px;
    557               height:16px;
    558               display:block;
    559               border-bottom-color:#bebebe;
    560               position:absolute;top:-16px;
    561               left:90px;
    562             }
    563             &:after{
    564               content:"";
    565               border:7px solid transparent;
    566               width:14px;
    567               height:14px;
    568               display:block;
    569               border-bottom-color:#fff;
    570               position:absolute;
    571               top:-13px;
    572               left:91px;
    573             }
    574           }
    575         }
    576         .menu-popup {
    577           ul{
    578             list-style:none;
    579             padding:0;
    580             margin:0;
    581             >li> a{
    582               color:#000;
    583               font-size:16px;
    584               line-height:2.5;
    585             }
    586           }
    587           >ul{
    588             display:flex;
    589             flex-wrap:wrap;
    590             >li{
    591               float:left;
    592               border-left:1px solid #bebebe;
    593               margin:10px 0;
    594               padding:30px 0;
    595               > a{
    596                 font-weight:700;
    597                 text-transform:uppercase;
    598               }
    599             }
    600             &.columns5>li{
    601               width:20%;
    602               padding-left:4%;
    603               padding-right:4%;
    604               &:nth-child(5n+1){
    605                 border-left:0;
    606                 clear:left;
    607               }
    608             }
    609           }
    610           li.menu-item{margin-bottom:0;}
    611         }
    612         .products-area{
    613           .category-link{
    614             float:right;
    615             margin-top:-71px;
    616             margin-right:0;
    617             position:relative;
    618             z-index:2;
    619             font-size: .8125rem;
    620             padding: 1em 3em;
    621             letter-spacing: .01em;
    622             font-weight: 700;
    623             line-height: 1.42857;
    624             background: #222529;
    625             border: 1px solid transparent;
    626             color: #fff;
    627             text-transform: uppercase;
    628           }
    629         }
    630       }
    631       .additional-content {
    632         margin-bottom: 1.5vw;
    633         img{
    634           max-width:100%;
    635         }
    636       }
    637       .menu-popup a>span{
    638         position:relative;
    639         >span.cat-label{
    640           top:3px;
    641           right:-35px;
    642           font:inherit;
    643           font-size:9px;
    644           padding:2px;
    645           z-index:1;
    646           border-radius:2px;
    647           line-height:1;
    648           border:1px solid #777;
    649           position:absolute;
    650         }
    651       }
    652       .onepage-category & {
    653         display:flex;
    654         flex-wrap:wrap;
    655       }
    656     }
    657     .onepage-cat.category-list {position: fixed;width: 80px;left: 0;height: 100%;top: 0;bottom: 0;}
    658     body>.onepage-cat.category-list {
    659         display: none;
    660     }
    661     // vc columns
    662     .pt_row {
    663       &.pt_row-no-padding {
    664         .pt_column-inner {
    665           padding-left: 0;
    666           padding-right: 0;
    667         }
    668       }
    669     }
    670 
    671     .pt_row-no-padding {
    672       .pt_inner {
    673         margin-left: 0;
    674         margin-right: 0;
    675       }
    676     }
    677 
    678     .pt_row {
    679       &.pt_row-o-full-height {
    680         min-height: 100vh;
    681       }
    682 
    683       // enable flex
    684       &.pt_row-flex {
    685         box-sizing: border-box;
    686         display: -webkit-box;
    687         display: -webkit-flex;
    688         display: -ms-flexbox;
    689         display: flex;
    690         -webkit-flex-wrap: wrap;
    691         -ms-flex-wrap: wrap;
    692         flex-wrap: wrap;
    693 
    694         > .pt_column_container {
    695           display: -webkit-box;
    696           display: -webkit-flex;
    697           display: -ms-flexbox;
    698           display: flex;
    699           > .pt_column-inner {
    700             -webkit-box-flex: 1;
    701             -webkit-flex-grow: 1;
    702             -ms-flex-positive: 1;
    703             flex-grow: 1;
    704             display: -webkit-box;
    705             display: -webkit-flex;
    706             display: -ms-flexbox;
    707             display: flex;
    708             -webkit-box-orient: vertical;
    709             -webkit-box-direction: normal;
    710             -webkit-flex-direction: column;
    711             -ms-flex-direction: column;
    712             flex-direction: column;
    713             z-index: 1;
    714             max-width: 100%;
    715             @media (-ms-high-contrast: active), (-ms-high-contrast: none) {
    716               /* IE10+ specific styles */
    717               & > * {
    718                 min-height: 1em;
    719               }
    720             }
    721           }
    722         }
    723 
    724         &::before,
    725         &::after {
    726           display: none;
    727         }
    728       }
    729 
    730       // columns alignment
    731       &.pt_row-o-columns-stretch {
    732         -webkit-align-content: stretch;
    733         -ms-flex-line-pack: stretch;
    734         align-content: stretch;
    735       }
    736       &.pt_row-o-columns-top {
    737         -webkit-align-content: flex-start;
    738         -ms-flex-line-pack: start;
    739         align-content: flex-start;
    740       }
    741       &.pt_row-o-columns-bottom {
    742         -webkit-align-content: flex-end;
    743         -ms-flex-line-pack: end;
    744         align-content: flex-end;
    745       }
    746       &.pt_row-o-columns-middle {
    747         -webkit-align-content: center;
    748         -ms-flex-line-pack: center;
    749         align-content: center;
    750       }
    751       &.pt_row-o-columns-top,
    752       &.pt_row-o-columns-bottom,
    753       &.pt_row-o-columns-middle {
    754         &::after {
    755           content: '';
    756           width: 100%;
    757           height: 0;
    758           overflow: hidden;
    759           visibility: hidden;
    760           display: block;
    761         }
    762       }
    763 
    764       // equal height
    765       &.pt_row-o-equal-height {
    766         > .pt_column_container {
    767           -webkit-box-align: stretch;
    768           -webkit-align-items: stretch;
    769           -ms-flex-align: stretch;
    770           align-items: stretch;
    771         }
    772       }
    773 
    774       // content alignment
    775       &.pt_row-o-content-top {
    776         > .pt_column_container {
    777           > .pt_column-inner {
    778             -webkit-box-pack: start;
    779             -webkit-justify-content: flex-start;
    780             -ms-flex-pack: start;
    781             justify-content: flex-start;
    782           }
    783         }
    784         &:not(.pt_row-o-equal-height) {
    785           > .pt_column_container {
    786             -webkit-box-align: start;
    787             -webkit-align-items: flex-start;
    788             -ms-flex-align: start;
    789             align-items: flex-start;
    790           }
    791         }
    792       }
    793       &.pt_row-o-content-bottom {
    794         > .pt_column_container {
    795           > .pt_column-inner {
    796             -webkit-box-pack: end;
    797             -webkit-justify-content: flex-end;
    798             -ms-flex-pack: end;
    799             justify-content: flex-end;
    800           }
    801         }
    802         &:not(.pt_row-o-equal-height) {
    803           > .pt_column_container {
    804             -webkit-box-align: end;
    805             -webkit-align-items: flex-end;
    806             -ms-flex-align: end;
    807             align-items: flex-end;
    808           }
    809         }
    810       }
    811       &.pt_row-o-content-middle {
    812         > .pt_column_container {
    813           > .pt_column-inner {
    814             -webkit-box-pack: center;
    815             -webkit-justify-content: center;
    816             -ms-flex-pack: center;
    817             justify-content: center;
    818           }
    819         }
    820         &:not(.pt_row-o-equal-height) {
    821           > .pt_column_container {
    822             -webkit-box-align: center;
    823             -webkit-align-items: center;
    824             -ms-flex-align: center;
    825             align-items: center;
    826           }
    827         }
    828       }
    829     }
    830 
    831     // Clearfix for column
    832     .pt_column-inner {
    833       &::before,
    834       &::after {
    835         content: " ";
    836         display: table;
    837       }
    838       &::after {
    839         clear: both;
    840       }
    841     }
    842     //
    843     //  Footer
    844     //  ---------------------------------------------
    845     .widget {
    846       &:first-child {margin-top: 0;}
    847       .tagcloud {
    848         margin-top: -.3846em;
    849         margin-bottom: -.3846em;
    850         a {
    851           margin: .3846em .3846em .3846em 0;
    852           padding: .25rem .5rem;
    853           line-height: 1;
131                     display: inline-block; 854           display: inline-block;
132                     vertical-align: top; 855           text-decoration: none;
    856           font-size: .75em!important;
    857           text-transform: uppercase;
    858           font-weight: 700;
    859           border-radius: 10px;
    860         }
    861       }
    862       &.contact-info {
    863         ul,li {
    864           border-width: 0;
133                     margin: 0; 865           margin: 0;
    866           padding: 0;
    867         }
    868         li {
    869           a{
    870             &:hover {text-decoration: underline;}
134                 } 871           }
    872           &:not(:last-child) {margin-bottom: 10px;}
    873         }
    874         p {margin-bottom: 10px;}
    875         i {clear: both;float: left;text-align: center;width: 16px;top: -2px;margin: 4px 9px 10px 0;font-size: 1.3em;position: static!important;}
    876         .contact-details {
    877           strong,span {display: block;padding-left: 25px;}
    878         }
    879       }
    880       &.follow-us {
    881         .share-links {
    882           a {
    883             width: 30px;
    884             height: 30px;
    885             border-radius: 30px;
    886             margin: 2px;
    887             overflow: hidden;
    888             box-shadow: 0 2px 2px 0 rgba(0,0,0,.3);
    889             transition: all 0.2s;
    890             font-size: 14px;
    891             &:hover {color: #fff;}
    892           }
    893         }
    894       }
    895     }
    896     .footer {
    897       &, p {
    898         font-size: 13px;
    899         line-height: 24px;
    900         letter-spacing: .065px;
    901       }
    902       ul {
    903           list-style: none;
    904           margin: 0;
    905           padding: 0;
135             } 906       }
136             &.features {    
137                 margin-top: -5px;    
138                     
139                 li { 907       li {
    908           margin: 0;
    909       }
    910       .widget {
    911         margin-bottom: 20px;
    912         p {margin-top: -3px;margin-bottom: 13px;font-size: 1em;}
    913         & + .widget {
    914           margin-top: 20px;
    915         }
    916         .tagcloud {
    917           a {
    918             background: none;border-radius: 0;font-size: 11px!important;font-weight: 400;text-transform: none;padding: .6em;border: 1px solid #313438;
    919             &:hover {border-color: #fff;color: #fff;}
    920           }
    921         }
    922       }
    923       .follow-us {
    924         .share-links {
    925           a {
    926             width: 40px;height: 40px;border-radius: 20px;border: 1px solid #313438;box-shadow: none;
    927             &:not(:hover) {background: none;color: #fff;}
    928           }
    929         }
    930       }
    931       .contact-info {
    932         i {display: none;}
    933         .contact-details {
    934           strong, span {padding-left: 0;}
    935           strong {line-height: 1em;color: #fff;font-weight: 400;}
    936         }
    937       }
    938       .newsletter {
    939         margin-bottom: 0;
    940         label {
    941             display: none;
    942         }
    943         .field .control:before {
    944             display: none;
    945         }
    946         input {
    947           height: 48px;
    948           padding-left: 25px;
    949           padding-right: 25px;
    950           border-radius: 30px 0 0 30px;
    951           font-size: .75rem;
    952           color: #777;
    953           border: none;
    954         }
    955         .action.subscribe {
    956           height: 48px;
    957           padding-left: 25px;
    958           padding-right: 25px;
    959           text-transform: uppercase;
    960           font-weight: 700;
    961           font-size: .75rem;
    962           border-radius: 0 30px 30px 0;
    963           border: none;
    964         }
    965       }
    966     }
    967     .footer-top {
    968       .custom-block {
    969         display: flex;
    970         -ms-flex-align: center;
    971         align-items: center;
    972         -ms-flex-pack: justify;
    973         justify-content: space-between;
    974         -ms-flex-wrap: wrap;
    975         flex-wrap: wrap;
    976         &:before, &::after {
    977             content: '';
    978             display: block;
    979             border-top: 1px solid #e7e7e7;
    980             -ms-flex: 0 0 100%;
    981             flex: 0 0 100%;
    982         }
    983         &:before {
    984             margin-bottom: 40px;
    985         }
    986         &:after {
    987             margin-top: 40px;
    988         }
    989       }
    990       .widget:last-child {
    991         margin-bottom: 0;
    992       }
    993     }
    994     .footer-middle {
    995         background-color: @footer-middle_background-color;
    996         color: @footer-middle_font-color;
    997         > .container {
140                     position: relative; 998             position: relative;
141                     padding: 10px 0; 999             padding-top: 4rem;padding-bottom: 1.5rem;
142                     line-height: 1; 1000             &::after {
    1001               content: '';
143                     display: block; 1002               display: block;
144                     
 1003               position: absolute;
    1004               left: 10px;
    1005               bottom: 0;
    1006               right: 10px;
    1007               border-bottom: 1px solid #313438;
    1008             }
    1009         }
    1010         .widget_media_image img {max-width: 111px;height: auto;display: block;}
145                     [class^="porto-icon-"], [class*=" porto-icon-"] { 1011         [class^="porto-icon-"], [class*=" porto-icon-"] {
146                         margin-left: -5px; 1012             color: @footer-middle-icon_font-color;
147                         margin-right: 3px;    
148                     } 1013         }
    1014         .block {
    1015           text-align: left;
    1016           line-height: 1.5;
    1017           margin: 0;
    1018           width: auto;
    1019           .block-title {
    1020             margin-bottom: 20px;
    1021             strong {
    1022               font-weight: 400;
    1023               padding: 0;
    1024               font-size: 16px;
    1025               color: @footer-middle-block-title_font-color;
    1026               text-transform: none;
149                 } 1027             }
150             } 1028           }
151         } 1029         }
152         a { 1030         a {
153             &, &:hover, &:focus { 1031             &, &:hover, &:focus {
154                 color: @footer-middle-link_font-color; 1032                 color: @footer-middle-link_font-color;
155             } 1033             }
156         } 1034         }
157         p {    
158             margin-bottom: 15px;    
159             line-height: 1.5;    
160         }    
161     } 1035     }
162     .footer-bottom { 1036     .footer-bottom {
163         min-height: 50px;    
164         line-height: 40px;    
165         background-color: @footer-bottom_background-color; 1037         background-color: @footer-bottom_background-color;
166         padding: 25px 0; 1038         padding: 15px 0;
167         
 1039         font-size: .9em;
    1040         >.container {
    1041           display: -webkit-flex;
    1042           display: flex;
    1043           -webkit-align-items: center;
    1044           align-items: center;
    1045           justify-content:
    1046           space-between;flex-wrap: wrap;
    1047         }
    1048         .widget {display: inline-block;margin: 0;}
168         .logo { 1049         .logo {
169             margin: 0; 1050             margin: 0;
170             margin-right: 45px; 1051             margin-right: 45px;
171             float: left; 1052             float: left;
172         } 1053         }
173             
174         .custom-block {    
175             float: left;    
176             line-height: 1;    
177             margin: 3px 0;    
178                 
179             img {    
180                 display: inline-block;    
181                 vertical-align: middle;    
182             }    
183         }            
184         .social-icons {    
185             display: inline-block;    
186             vertical-align: middle;    
187             margin-right: 60px;    
188         }    
189         address { 1054         address {
190             float: right; 1055             order: 1;padding: 10px 8px 10px 0;text-align: left;margin-right: auto;flex: auto;
191             line-height: 30px;    
192             margin: 0;    
193         } 1056         }
194         .custom-block { 1057         .custom-block {
195             &.f-right { 1058             &.f-right {
196                 margin-left60px; 1059                 margin
0;order: 2;
197             } 1060                 padding: 10px 10px 8px;
198             ul.links { 1061                 text-align: right;
199                 display: inline-block; 1062                 flex: auto;
200                     
201                 li {    
202                     padding: 
12px;
    
203                     border-right: 1px solid #bbb;    
204                     font-size: 11px;    
205                     display: inline;    
206                     vertical-align: middle;    
207     
208                     &:first-child {    
209                         padding-left: 0;    
210                     }    
211                 }    
212                 a {    
213                     color: #777;    
214                     font-size: 11px;    
215                 }    
216             } 1063             }
217         } 1064         }
218         .switcher { 1065         .switcher {
219             line-height: 1 !important; 1066             line-height: 1 !important;
220             display: block; 1067             display: block;
221             height: auto; 1068             height: auto;
222             margin-top: 15px; 1069             margin-top: 15px;
223             float: left; 1070             float: left;
224              1071 
225             label { 1072             label {
226                 display: none; 1073                 display: none;
227             } 1074             }
228             select { 1075             select {
229                 display: inline-block; 1076                 display: inline-block;
230                 width: auto; 1077                 width: auto;
231                 line-height: 1; 1078                 line-height: 1;
232             } 1079             }
233         } 1080         }
234     } 1081     }
235     .footer-ribbon { 1082     .footer-ribbon {
236         position: absolute;    
237         margin: -56px 0 25px;    
238         padding: 10px 20px 6px 20px;    
239         background-color: @footer-ribbon_background-color; 1083         background-color: @footer-ribbon_background-color;
240         &:before {    
241             content: '';    
242             display: block;    
243             width: 7px;    
244             height: 0;    
245             position: absolute; 1084         position: absolute;
246             left: -10px;    
247             top: 0; 1085         top: 0;
248             border-right: 10px solid darken(@footer-ribbon_background-color, 10%); 1086         margin: -16px 0 0;
249             border-top: 16px solid transparent; 1087         padding: 10px 20px 6px;
250         } 1088         color: #fff;
    1089         font-size: 1.6em;
    1090         z-index: 4;
251         span { 1091         span {
252             color: @footer-ribbon_font-color; 1092             color: @footer-ribbon_font-color;
253             font-size: 20px;    
254             font-family: "Shadows Into Light",cursive; 1093             font-family: "Shadows Into Light",cursive;
255             line-height: 1; 1094             line-height: 1;
256         } 1095         }
257     } 1096         &:before {
258     .social-icons { 1097           content: "";
259          1098           display: 
block;
260         li { 1099           height: 0;
261             display: inline-block; 1100           position: absolute;
262             vertical-align: middle; 1101           top: 0;
263              1102           width: 7px;
264             &:first-child a { 1103           right: 100%;
265                 margin-left: 0; 1104           border-right: 10px solid #646464;
266             } 1105           border-top: 16px solid transparent;
267         }    
268         > li > a {    
269             display: inline-block;    
270             width: 30px;    
271             height: 30px;    
272             background-color: #9e9e9e;    
273             line-height: 30px;    
274             text-align: center;    
275             border-radius: 50%;    
276             color: #fff;    
277             font-size: 16px;    
278             margin-left: 7px;    
279             transition: 0.3s background-color;    
280             &:hover, &:focus {    
281                 color: #fff;    
282             }    
283             &.facebook-link:hover {    
284                 background-color: #3c599b;    
285             }    
286             &.twitter-link:hover {    
287                 background-color: #1ca8e3;    
288             }    
289             &.linkedin-link:hover {    
290                 background-color: #4975b6;    
291             }    
292         } 1106         }
293     } 1107     }
294      1108 
295     /*** About US ***/ 1109     /*** About US ***/
296     h2.word-rotator-title { 1110     h2.word-rotator-title {
297         line-height: 30px; 1111         line-height: 30px;
298         font-size: 20px; 1112         font-size: 20px;
299         font-weight: 300; 1113         font-weight: 300;
300         margin: 0 0 20px 0; 1114         margin: 0 0 20px 0;
301         color: #121214; 1115         color: #121214;
302     } 1116     }
303     .word-rotate { 1117     .word-rotate {
304         visibility: hidden; 1118         visibility: hidden;
305         width: 100px; 1119         width: 100px;
306         height: 0; 1120         height: 0;
307         margin-bottom: -7px; 1121         margin-bottom: -7px;
308         display: inline-block; 1122         display: inline-block;
309         overflow: hidden; 1123         overflow: hidden;
310         text-align: center; 1124         text-align: center;
311         position: relative; 1125         position: relative;
312          1126 
313         h2 & { 1127         h2 & {
314             margin-bottom: -7px 1128             margin-bottom: -7px
315         }         1129         }
316         &.active { 1130         &.active {
317             visibility: visible; 1131             visibility: visible;
318             width: auto; 1132             width: auto;
319         } 1133         }
320         .word-rotate-items { 1134         .word-rotate-items {
321             position: relative; 1135             position: relative;
322             top: 0; 1136             top: 0;
323             width: 100%; 1137             width: 100%;
324              1138 
325             span { 1139             span {
326                 display: block; 1140                 display: block;
327                 white-space: nowrap; 1141                 white-space: nowrap;
328             } 1142             }
329         } 1143         }
330     } 1144     }
331     p .alternative-font { 1145     p .alternative-font {
332         display: inline-block; 1146         display: inline-block;
333         margin-top: -15px; 1147         margin-top: -15px;
334         position: relative; 1148         position: relative;
335         top: 3px; 1149         top: 3px;
336         margin-bottom: -6px; 1150         margin-bottom: -6px;
337         color: @theme-color; 1151         color: @theme-color;
338         font-family: "Shadows Into Light",cursive; 1152         font-family: "Shadows Into Light",cursive;
339         font-size: 1.6em; 1153         font-size: 1.6em;
340     } 1154     }
341     .btn-primary { 1155     .btn-primary {
342         color: #fff; 1156         color: #fff;
343         text-shadow: 0 -1px 0 rgba(0,0,0,.25); 1157         text-shadow: 0 -1px 0 rgba(0,0,0,.25);
344         background-color: @button-primary__background; 1158         background-color: @button-primary__background;
345         border-color: @button-primary__background; 1159         border-color: @button-primary__background;
346          1160 
347         &:hover { 1161         &:hover {
348             color: #fff; 1162             color: #fff;
349             opacity: 0.85; 1163             opacity: 0.85;
350         } 1164         }
351     } 1165     }
352     .btn { 1166     .btn {
353         display: inline-block; 1167         display: inline-block;
354         margin-bottom: 0; 1168         margin-bottom: 0;
355         font-weight: normal; 1169         font-weight: normal;
356         text-align: center; 1170         text-align: center;
357         vertical-align: middle; 1171         vertical-align: middle;
358         cursor: pointer; 1172         cursor: pointer;
359         background-image: none; 1173         background-image: none;
360         border: 1px solid transparent; 1174         border: 1px solid transparent;
361         white-space: nowrap; 1175         white-space: nowrap;
362         padding: 6px 12px; 1176         padding: 6px 12px;
363         font-size: 14px; 1177         font-size: 14px;
364         line-height: 1.42857143; 1178         line-height: 1.42857143;
365         border-radius: 4px; 1179         border-radius: 4px;
366          1180 
367         &:hover { 1181         &:hover {
368             text-decoration: none; 1182             text-decoration: none;
369         } 1183         }
370  1184 
371         &-lg { 1185         &-lg {
372             padding: 10px 16px; 1186             padding: 10px 16px;
373             font-size: 18px; 1187             font-size: 18px;
374             line-height: 1.33; 1188             line-height: 1.33;
375             border-radius: 6px; 1189             border-radius: 6px;
376         } 1190         }
377     } 1191     }
378     .push-top { 1192     .push-top {
379         margin-top: 20px; 1193         margin-top: 20px;
380     } 1194     }
381     hr.tall { 1195     hr.tall {
382         margin: 30px 0; 1196         margin: 30px 0;
383         background-image: -webkit-linear-gradient(left,transparent,rgba(0,0,0,.2),transparent); 1197         background-image: -webkit-linear-gradient(left,transparent,rgba(0,0,0,.2),transparent);
384         background-image: linear-gradient(left,transparent,rgba(0,0,0,.2),transparent); 1198         background-image: linear-gradient(left,transparent,rgba(0,0,0,.2),transparent);
385         border: 0; 1199         border: 0;
386         height: 1px; 1200         height: 1px;
387     } 1201     }
388     .entry-content { 1202     .entry-content {
389         h3 { 1203         h3 {
390             font-size: 1.7em; 1204             font-size: 1.7em;
391             font-weight: normal; 1205             font-weight: normal;
392             color: @theme-color; 1206             color: @theme-color;
393             letter-spacing: normal; 1207             letter-spacing: normal;
394             line-height: 24px; 1208             line-height: 24px;
395             margin-bottom: 33px; 1209             margin-bottom: 33px;
396             text-transform: uppercase; 1210             text-transform: uppercase;
397         } 1211         }
398         p { 1212         p {
399             font-size: 14px; 1213             font-size: 14px;
400             line-height: 24px; 1214             line-height: 24px;
401             margin-bottom: 20px; 1215             margin-bottom: 20px;
402         } 1216         }
403         .lead { 1217         .lead {
404             font-size: 21px; 1218             font-size: 21px;
405             line-height: 1.4; 1219             line-height: 1.4;
406         } 1220         }
407     } 1221     }
408     .history { 1222     .history {
409         margin: 25px 0; 1223         margin: 25px 0;
410         padding: 0; 1224         padding: 0;
411         clear: both; 1225         clear: both;
412          1226 
413         .thumb { 1227         .thumb {
414             background: transparent url(../images/history-thumb.png) no-repeat 0 0; 1228             background: transparent url(../images/history-thumb.png) no-repeat 0 0;
415             width: 227px; 1229             width: 227px;
416             height: 160px; 1230             height: 160px;
417             margin: 0 0 30px; 1231             margin: 0 0 30px;
418             padding: 0; 1232             padding: 0;
419             float: left; 1233             float: left;
420  1234 
421             img { 1235             img {
422                 border-radius: 50%; 1236                 border-radius: 50%;
423                 margin: 7px 8px; 1237                 margin: 7px 8px;
424                 width: 145px; 1238                 width: 145px;
425                 height: 145px; 1239                 height: 145px;
426             } 1240             }
427         } 1241         }
428         h4 { 1242         h4 {
429             float: left; 1243             float: left;
430             margin: 15px 0; 1244             margin: 15px 0;
431             padding: 0; 1245             padding: 0;
432             color: @theme-color; 1246             color: @theme-color;
433             line-height: 27px; 1247             line-height: 27px;
434         } 1248         }
435         p { 1249         p {
436             margin: 0; 1250             margin: 0;
437             margin-left: 55px; 1251             margin-left: 55px;
438             line-height: 24px; 1252             line-height: 24px;
439         } 1253         }
440     } 1254     }
441     .featured-box { 1255     .featured-box {
442         background: #f5f5f5; 1256         background: #f5f5f5;
443         background-color: transparent; 1257         background-color: transparent;
444         background: linear-gradient(to bottom,white 1%,#f9f9f9 98%) repeat scroll 0 0 transparent; 1258         background: linear-gradient(to bottom,white 1%,#f9f9f9 98%) repeat scroll 0 0 transparent;
445         box-sizing: border-box; 1259         box-sizing: border-box;
446         border-bottom: 1px solid #DFDFDF; 1260         border-bottom: 1px solid #DFDFDF;
447         border-left: 1px solid #ECECEC; 1261         border-left: 1px solid #ECECEC;
448         border-radius: 8px; 1262         border-radius: 8px;
449         border-right: 1px solid #ECECEC; 1263         border-right: 1px solid #ECECEC;
450         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.04); 1264         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.04);
451         margin-bottom: 20px; 1265         margin-bottom: 20px;
452         margin-left: auto; 1266         margin-left: auto;
453         margin-right: auto; 1267         margin-right: auto;
454         margin-top: 20px; 1268         margin-top: 20px;
455         min-height: 100px; 1269         min-height: 100px;
456         position: relative; 1270         position: relative;
457         text-align: center; 1271         text-align: center;
458         z-index: 1; 1272         z-index: 1;
459          1273 
460         .box-content { 1274         .box-content {
461             border-radius: 8px; 1275             border-radius: 8px;
462             border-top: 4px solid @theme-color; 1276             border-top: 4px solid @theme-color;
463             padding: 30px 20px; 1277             padding: 30px 20px;
464         } 1278         }
465         h4 { 1279         h4 {
466             font-size: 1.3em; 1280             font-size: 1.3em;
467             font-weight: 400; 1281             font-weight: 400;
468             letter-spacing: -0.7px; 1282             letter-spacing: -0.7px;
469             text-transform: uppercase; 1283             text-transform: uppercase;
470         } 1284         }
471         .block-flickr-photos { 1285         .block-flickr-photos {
472             border: 0; 1286             border: 0;
473  1287 
474             .block-title { 1288             .block-title {
475                 display: none; 1289                 display: none;
476             } 1290             }
477             a.flickr-image { 1291             a.flickr-image {
478                 margin: 5px; 1292                 margin: 5px;
479                 display: inline-block; 1293                 display: inline-block;
480                 border: 1px solid #dcdcdc; 1294                 border: 1px solid #dcdcdc;
481                 padding: 5px; 1295                 padding: 5px;
482                 border-radius: 5px; 1296                 border-radius: 5px;
483                  1297 
484                 img { 1298                 img {
485                     max-width: 100%; 1299                     max-width: 100%;
486                     width: 75px; 1300                     width: 75px;
487                 } 1301                 }
488             } 1302             }
489         } 1303         }
490     } 1304     }
491     .history .featured-box { 1305     .history .featured-box {
492         text-align: left; 1306         text-align: left;
493         margin-left: 225px; 1307         margin-left: 225px;
494         margin-bottom: 35px; 1308         margin-bottom: 35px;
495         min-height: 115px; 1309         min-height: 115px;
496          1310 
497         .box-content { 1311         .box-content {
498             border-top-color: @theme-color; 1312             border-top-color: @theme-color;
499         } 1313         }
500     } 1314     }
501     #newsletter_popup { 1315     #newsletter_popup {
502         background
url(../images/newsletter_popup_bg.jpg) no-repeat;
 1316         background#ffffff url(../images/shop_newsletter_popup.jpg) no-repeat;
    1317         box-shadow: 0 0 50px rgba(0, 0, 0, .12);
    1318         background-position: center;
    1319         background-size: cover;
    1320         padding: 4rem 2.5rem;
503         margin: 0; 1321         margin: 0;
504         padding: 40px 40px 25px; 1322         width: 740px;
505         width: 700px; 1323         min-height: 300px;
506         
height: 325px;
    
507         border-top: 4px solid @theme-color;    
508         text-align: left; 1324         text-align: left;
509         position: relative; 1325         position: relative;
510         border-radius: 5px; 1326         .text_left {
511          1327           img {
512         .block-content { 1328             max-width: 111px;
513             max-width: 312px; 1329             display: block;
514             text-align: center;    
515             padding: 6px;    
516         }    
517         h2 {    
518             font-weight: 700;    
519             color: #313131;    
520             font-size: 16px;    
521             line-height: 1;    
522             margin: 30px 0 12px;    
523         }    
524         p {    
525             font-size: 13px;    
526             line-height: 1.4;    
527         } 1330           }
528         .input-box {    
529             padding: 0;    
530         } 1331         }
    1332         form.subscribe {display: flex;align-items: center;}
    1333         .field {flex: 1;}
    1334         .field,.actions {margin-bottom: 20px;}
531         input[type="email"] { 1335         input[type="email"] {
532             float: left; 1336           height: 3rem;
533             padding: 2px 13px; 1337           border: none;
534             line-height: 30px; 1338           border-radius: 1.5rem 0 0 1.5rem;
535             width: 100%; 1339           background: #f4f4f4;
536             height: 34px; 1340           box-shadow: none !important;
537         } 1341           padding-left: 1.375rem;
538         .actions {    
539             float: left;    
540             margin-left: -55px;    
541             position: relative;    
542             z-index: 1;    
543             width: 55px;    
544             border-left: 1px solid #ccc;    
545         } 1342         }
546         .action.primary { 1343         .action.primary {
547             height: 34px; 1344             height: 3rem;
548             background-color: transparent; 1345             padding-left: 1.5rem;
    1346             padding-right: 2rem;
    1347             border-radius: 0 1.5rem 1.5rem 0;
    1348             box-shadow: none !important;
    1349             margin-right: .5rem;
    1350             font-weight: 700;
    1351         }
    1352         label.checkbox {
    1353             display: inline-block;
    1354             margin-top: 0;
    1355             margin-bottom: 0;
    1356             margin-right: 5px;
    1357         }
    1358         .checkbox {
    1359             font-size: .75rem;
    1360             input[type="checkbox"] {
    1361                 -webkit-appearance: none;
    1362                 -moz-appearance: none;
    1363                 border: 1px solid #ccc;
    1364                 width: 1.25rem;
    1365                 height: 1.25rem;
    1366                 margin-top: -.1rem;
    1367                 margin-left: 1px;
    1368                 margin-right: 5px;
    1369                 vertical-align: middle;
    1370                 outline: none;
    1371                 border-radius: 3px;
549             color: #555; 1372                 color: #555;
550             line-height: 34px; 1373                 top: 0;
551             padding: 0; 1374                 &:checked:before {
    1375                   content: "\e8c5";
    1376                   font-family: 'porto-icons';
    1377                   font-weight: 900;
    1378                   margin: 0;
    1379                   width: 1.15rem;
    1380                   height: 1.2rem;
    1381                   line-height: 1.2rem;
    1382                   float: left;
    1383                   font-size: 11px;
552             text-align: center; 1384                   text-align: center;
553             width: 100%;    
554             border: 0;    
555         } 1385                 }
556         .subscribe-bottom {    
557             position: absolute;    
558             bottom: 30px;    
559                 
560             label {    
561                 font-size: 11px;    
562                 vertical-align: middle;    
563             } 1386             }
564         } 1387         }
565         #newsletter_popup_dont_show_again { 1388         div.mage-error[generated] {
566             margin-top1px; 1389           position: absolute;
567             vertical-align: middle; 1390           margin-top40px;
    1391           font-size: .87em;
568         } 1392         }
569     } 1393     }
570 } 1394 }
571  1395 
572 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) { 1396 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
573     .footer-bottom { 1397     .footer-bottom {
574         & > .container > * { 1398         & > .container > * {
575             float: none !important; 1399             float: none !important;
576             line-height: 35px !important; 1400             line-height: 35px !important;
577         } 1401         }
578     } 1402     }
579         
580     .history { 1403     .history {
581         .featured-box { 1404         .featured-box {
582             margin-left: 0; 1405             margin-left: 0;
583         } 1406         }
584         .thumb { 1407         .thumb {
585             display: none; 1408             display: none;
586         } 1409         }
587     } 1410     }
588 } 1411 }
    1412 @media (min-width: 768px) {
    1413   .onepage-category{
    1414     >.category-list{
    1415       >ul{
    1416         >li{
    1417           margin-bottom: 1rem;
    1418         }
    1419       }
    1420     }
    1421   }
    1422   .pt_row-o-full-height>.container>.row, .pt_row-o-equal-height>.container>.row>.pt_column_container>.pt_column-inner {
    1423     height: 100%;
    1424   }
    1425   .footer .footer-top .widget {
    1426       margin: 0;
    1427   }
    1428 }
    1429 @media(max-width:1199px){
    1430   .onepage-cat.category-list+.main.container{padding:0 50px;}
    1431   .onepage-category {
    1432     .category-detail {
    1433       .menu-popup ul>li> a{font-size:11px;}
    1434       .title-menu>.menu-popup{padding:10px 0;}
    1435     }
    1436   }
    1437 }
    1438 @media (max-width:991px) {
    1439   .footer .footer-bottom >.container {justify-content: flex-start;}
    1440   .footer .footer-bottom .custom-block.f-right {padding-left: 0;text-align: left;}
    1441   .porto-ibanner-layer {
    1442       font-size:.875rem
    1443   }
    1444 }
    1445 @media (min-width: 768px) and (max-width:991px) {
    1446   .onepage-category{
    1447     >.category-list{
    1448       .nav-open &{position:absolute;}
    1449     }
    1450   }
    1451 }
    1452 @media (max-width: 767px) {
    1453   .porto-ibanner-layer {
    1454       font-size:.8125rem
    1455   }
    1456   .cms-index-index .onepage-category,.onepage-category{display:block}
    1457   .onepage-category{
    1458     >.category-list{
    1459       width:auto;float:none;padding:0;min-height:0;position:static;margin-bottom:20px;
    1460       >ul{
    1461         padding:0;
    1462         >li{
    1463           margin:0;
    1464           display:inline-block;
    1465           >a:after,>a:hover>span{display:none;}
    1466         }
    1467       }
    1468     }
    1469     >.category-details{
    1470       float:none;
    1471       width:auto;
    1472     }
    1473     >.category-list>ul{position:static!important;}
    1474     .category-detail {
    1475       .menu-popup {
    1476         >ul{
    1477           display:block;
    1478           &.columns5>li{
    1479             width:50%;
    1480             padding:10px 15px;
    1481             &:nth-child(5n+1){
    1482               border-left:1px solid #bebebe;
    1483               clear:none;
    1484             }
    1485             &:nth-child(2n+1){
    1486               border-left:0;
    1487               clear:left;
    1488             }
    1489           }
    1490         }
    1491         ul>li> a{font-size:14px;}
    1492       }
    1493     }
    1494   }
    1495 }
    1496 @media (max-width: 575px) {
    1497     .porto-ibanner-layer {
    1498         font-size:.75rem
    1499     }
    1500     .onepage-category .category-detail .products-area .category-link{
    1501       margin-left:0;
    1502       margin-bottom: 25px;
    1503       float:none;
    1504       display:inline-block;
    1505     }
    1506 }